<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <title>{% block title %}monitorX{% endblock %}</title>
    <!-- Favicon-->
    <link rel="icon" href="/static/assets/favicon.ico" type="image/x-icon">

    <!-- Google Fonts -->
    <link href="http://fonts.airwaybill.cn/icon?family=Material+Icons" rel="stylesheet">
      <link href="http://fonts.airwaybill.cn/css2?family=Do+Hyeon&display=swap" rel="stylesheet">
    <link href="/static/assets/plugins/bootstrap/css/bootstrap.css" rel="stylesheet">
    <link href="/static/assets/plugins/node-waves/waves.css" rel="stylesheet" />
    <link href="/static/assets/plugins/animate-css/animate.css" rel="stylesheet" /> 
    <link href="/static/assets/css/style.css?v=1.02" rel="stylesheet">

    <style>
        .footer { 
            width:100%;
            background-color:white; 
            height:45px;
            text-align:center 
        }
        .copyright {
            padding-top:15px
        }
        .log1 {
            font-family: 'Do Hyeon', sans-serif !important;
            margin: 0;
            padding: 0;
            font-size: 24px;
            color: #d8d461;
        }
        .log2 {
            margin: 0;
            padding: 0;
            font-size: 24px;
            font-family: 'Do Hyeon', sans-serif !important;
            color: #5ac580;
        }
        .sub {
            font-family: 'Do Hyeon', sans-serif !important;
            font-size: 20px;
            line-height: 34px;
            color: black;
        }

        h1 {
            font-family: 'Do Hyeon', sans-serif !important;
        }
       
        .features   {
            position: relative;
            z-index: 1; 
            text-align: center;
        }
        .carousel-inner img {
            margin: auto;
            width: 100%;
        }
  
    </style>

    <script src="http://static.ibayeux.com/lodash.min.js"></script>
    <script src="http://static.ibayeux.com/axios.min.js"></script>
    <script>
    </script>
    
 
</head>
<body class="theme-indigo" style="background-color: white;">
     
    <div id="loading">

    </div>
  <!-- Overlay For Sidebars -->
  <div class="overlay"></div>
  <!-- #END# Overlay For Sidebars -->
  <!-- Search Bar -->
   
  <!-- #END# Search Bar -->
  <!-- Top Bar -->
  <nav class="navbar">
      <div class="container"  >
          <div class="navbar-header">
              <a href="javascript:void(0);" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false"></a>
              <a href="javascript:void(0);" class="bars"></a>
              <a class="navbar-brand" href="/"><span class="log1">monitor</span><span  class="log2">x</span></a>
          </div>
          <ul class="nav navbar-nav navbar-right">  
            {% if user.is_authenticated %}
            <li class="dropdown">
              
                <a href="/dashboard/"  >
                    <i class="material-icons">account_circle</i> <span class="icon-name">控制台</span>   
                </a>
                 
            </li>
            {% else %}
            <li class="dropdown"> 
                <a href="/sigup/"  >
                      <span class="munu">注册</span>   
                </a>
                 
            </li>
            <li class="dropdown"> 
                <a href="/login/"  >
                     <span class="munu">登录</span>   
                </a>
                 
            </li>
            {% endif %}
            <!-- #END# Tasks -->
            
        </ul>
       
      </div>
  </nav>

  <section class="content" style="min-height:85vh">
      <div class="container" >
        <div  class="features">
            <h1><span style="color:green">monitor</span><span style="color:blue">X</span> Linux Server Monitoring</h1>
            <p class="sub">
                客户端基于完全开源的<a href="https://github.com/nodequery/nq-agent">nodequery Agent</a>,安全可靠.
            </p>
        </div> 
      </div>
      <div class="container">
        <div class="">
            <div class="" >
                <div id="carousel-example-generic_2" class="carousel slide" data-ride="carousel">
                    <!-- Indicators -->
                    <ol class="carousel-indicators">
                        <li data-target="#carousel-example-generic_2" data-slide-to="0" class=""></li>
                        <li data-target="#carousel-example-generic_2" data-slide-to="1" class="active"></li>
                        <li data-target="#carousel-example-generic_2" data-slide-to="2" class=""></li>
                    </ol>
                    <!-- Wrapper for slides -->
                    <div class="carousel-inner" role="listbox">
                        <div class="item">
                            <img src="/static/assets/images/nodequery/home1.png">
                            <div class="carousel-caption"> 
                            </div>
                        </div>
                        <div class="item active">
                            <img src="/static/assets/images/nodequery/home2.png">
                            <div class="carousel-caption">
                           
                            </div>
                        </div>
                        <div class="item">
                            <img src="/static/assets/images/nodequery/home3.png">
                            <div class="carousel-caption"> 
                            </div>
                        </div>
                    </div>
                    <!-- Controls -->
                    <a class="left carousel-control" href="#carousel-example-generic_2" role="button" data-slide="prev">
                        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                        <span class="sr-only">Previous</span>
                    </a>
                    <a class="right carousel-control" href="#carousel-example-generic_2" role="button" data-slide="next">
                        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                    </a>
                </div>
            </div>
        </div>
      </div>
      
  </section>
  
    <section class="footer" >
        
        <div class="copyright">
            © <script>document.write(new Date().getFullYear())</script><a href="/">monitorX</a>.
        </div>
    </div>
      <script src="/static/assets/plugins/jquery/jquery.min.js"></script>
      <script src="/static/assets/plugins/bootstrap/js/bootstrap.js"></script> 
      <script src="http://cdn.ibayeux.com/js/layer/layer.js"></script>
      <script src="/static/assets/js/function.js"></script>
      <!-- Plugin Js --> 
      <script src="/static/assets/plugins/jquery-slimscroll/jquery.slimscroll.js"></script>
      <script src="/static/assets/plugins/node-waves/waves.js"></script>
      <script src="/static/assets/plugins/bootstrap-notify/bootstrap-notify.js"></script>
      <!-- Custom Js -->
    
       

   {% block js %}
   {% endblock %}
  </body>
</html>
